<?php require_once("user_register.php"); ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" />
<link href="css/style.css" rel='stylesheet' type='text/css' />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.package-slider.js"></script>
<script>
    var email_regex = /^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;  // email address
    var password_regex = /^[A-Za-z\d]{6,10}$/; // any upper lowercase characters and digits, between 6 to 8 characters in total
    var name_regex = /^[A-Za-z]{2,15}$/; // any upper/lowercase characters and digits, between 6 to 8 characters in total
    var u_name_regex = /^[A-Za-z\d?]{3,15}$/;


    function username_check() {
        var e = document.getElementById("user_name");
        if ( !e.value.match(u_name_regex) ){ document.getElementById('username_error').innerHTML="User Name Have To Be From Only Letters And Digits minimun 3 characters"; }
        else{ document.getElementById('username_error').innerHTML="&nbsp"; }
    }

    function fname_check() {
        var e = document.getElementById("fname");
        if ( !e.value.match(name_regex) ){ document.getElementById('fname_error').innerHTML="First Name Have To Be From Only Letters And Minimun 2 Characters"; }
        else{ document.getElementById('fname_error').innerHTML="&nbsp"; }
    }

    function lname_check() {
        var e = document.getElementById("lname");
        if ( !e.value.match(name_regex) ){ document.getElementById('lname_error').innerHTML="Last Name Have To Be From Only Letters And Minimun 2 Characters"; }
        else{ document.getElementById('lname_error').innerHTML="&nbsp"; }
    }

    function email_check() {
        var e = document.getElementById("email");
        var b = document.getElementById("emailc");
        if ( !email_regex.test( e.value ) ){ document.getElementById('email_error').innerHTML="This E-mail Address is Not Valid"; }
        else{ document.getElementById('email_error').innerHTML=""; }

        if ( e.value != b.value ){ document.getElementById('emailc_error').innerHTML="E-mail is Not The Same"; }
        else{ document.getElementById('emailc_error').innerHTML="&nbsp"; }
    }

    function emailc_check() {
        var e = document.getElementById("emailc");
        var b = document.getElementById("email");
        if ( e.value != b.value ){ document.getElementById('emailc_error').innerHTML="E-mail is Not The Same"; }
        else{ document.getElementById('emailc_error').innerHTML="&nbsp"; }
    }

    function password_check() {
        var e = document.getElementById("pass_word");
        var b = document.getElementById("pass_wordc");
        if (!e.value.match(password_regex) ){ document.getElementById('password_error').innerHTML="Input Error Upper/Lowercase Characters And Digits,6-10 Characters In Total"; }
        else{ document.getElementById('password_error').innerHTML="&nbsp"; }
        if ( e.value != b.value ){ document.getElementById('passwordc_error').innerHTML="Password is Not The Same"; }
        else{ document.getElementById('passwordc_error').innerHTML="&nbsp"; }
    }

    function passwordc_check() {
        var e = document.getElementById("pass_wordc");
        var b = document.getElementById("pass_word");
        if ( e.value != b.value ){ document.getElementById('passwordc_error').innerHTML="Password is Not The Same"; }
        else{ document.getElementById('passwordc_error').innerHTML="&nbsp"; }
    }

</script>
<title>A&A ONLINE UNIVERSITY</title>
</head>

<body>

<!-- START HEADER WRAPER-->
<div id="header-color">
    <div id="header-wrapper">
        <?php require("header.php"); ?>
        <b class="hellouser"> Hello Visitor </b>
    </div>
</div>
<!-- START CONTENT WRAPER-->
<!-- <div id="page-wrapper"> -->
<div id="page-content" style="margin:20px 0px 0px 150px; background: rgba(120, 158, 19, 0.81);border-radius: 20px; width:985px;">

    <b style=" margin-left: 15px; ">Please Fill The Profile Information</b>
    <p>
    <form name="registration_form" class="registration_form" method="post" action="">
        <div class="subjects">
            <div class="colReg" >
                <ul>
                    <li class="register">User Name:</li>
                    <li class="register">First Name:</li>
                    <li class="register">Last Name:</li>
                    <li class="register">E-mail address:</li>
                    <li class="register">Confirm E-mail address:</li>
                    <li class="register">Password:</li>
                    <li class="register">Confirm password:</li>
                    <li class="register">Your Position:</li>
                </ul>
            </div>     
            <div class="colReg" >
                <ul class="regBull">
                    <li><input type="text" class="input" style="maxlength="10"" id="user_name" name="user_name" onChange="username_check()" title="Please enter your user name">      </li>
                    <li><input type="text" class="input" style="maxlength="10"" id="fname"    name="fname"    onChange="fname_check()"    title="Please enter your first name">     </li>
                    <li><input type="text" class="input" style="maxlength="10"" id="lname"    name="lname"    onChange="lname_check()"    title="Please enter your last name" >     </li>
                    <li><input type="text" class="input" style="maxlength="10"" id="email"    name="email"    onChange="email_check()"    title="Please enter your E-mail address"> </li>
                    <li><input type="text" class="input" style="maxlength="10"" id="emailc"   name="emailc"   onChange="emailc_check()"   title="Please Confirm E-mail address">    </li>
                    <li><input type="password" class="input" style="maxlength="15"" id="pass_word"   name="pass_word"  onChange="password_check()"  title="at least 8 characters, with at least 1 uppercase, 1 lowercase and 1 number."></li>
                    <li><input type="password" class="input" style="maxlength="15"" id="pass_wordc"  name="pass_wordc" onChange="passwordc_check()" title="Please Confirm your Password">      </li>
                    <li> <select requierd name="pos" class="input" > <option value="Sel"> Seller </option> <option value="Ser"> User </option> <option value="Slr"> Both </option> </select> </li>
                    <li>&nbsp</li>
                    <li>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
                        <input name="Registration" style="font-size:9px" type="submit" value="Registration" class="button" /></li>
                </ul>
            </div>
            <div class="colReg" >
                <ul class="regBull">
                    <li class="register" id="username_error"   name="username_error">&nbsp  </li>
                    <li class="register" id="fname_error"      name="fname_error">&nbsp     </li>
                    <li class="register" id="lname_error"      name="lname_error">&nbsp     </li>
                    <li class="register" id="email_error"      name="email_error">&nbsp     </li>
                    <li class="register" id="emailc_error"     name="emailc_error">&nbsp    </li>
                    <li class="register" id="password_error"   name="password_error">&nbsp  </li>
                    <li class="register" id="passwordc_error"  name="passwordc_error">&nbsp </li>
                </ul>
            </div>

            <?php if( isset($_POST['Registration']) ){  //Posted By Form (name="Registration")
            if ( isset($_POST['user_name']) && isset($_POST['fname']) && isset($_POST['lname']) && isset($_POST['email']) && isset($_POST['emailc']) && isset($_POST['pass_word']) && isset($_POST['pass_wordc']) && isset($_POST['pos']) ){
                $insection = userRegister(
                    $_POST['user_name'], 
                    $_POST['fname'], 
                    $_POST['lname'], 
                    $_POST['email'], 
                    $_POST['emailc'], 
                    $_POST['pass_word'], 
                    $_POST['pass_wordc'], 
                    $_POST['pos']);
            
                if ($insection[0]==1) { header("location:client.php"); } 
            }
            else{ $insection[0] = 0 ; } ?> 

            <?php if ($insection[0]==2) { ?><p> <li class="register">&nbsp&nbspRegistration Success - Error Occurred on Login </li> <?php } ?>
            <?php if ($insection[0]==0) { ?><p> <li class="register">&nbsp&nbspERROR Registration haven't been made </li> <?php } ?>
            <?php } ?>
            
        </div>
     </form>
    </p>
<!-- END CONTENT WRAPER-->
</div>
<!-- START FOOTER WRAPER-->
<p><?php require("footer.php"); ?></p>
</body>
</html>
